<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>自动点名器</title>
    <link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
    <div class="container">
        <h1>自动点名系统</h1>
        
        <div class="control-panel">
            <button onclick="startRoll()" id="startBtn">开始</button>
            <button onclick="stopRoll()" id="stopBtn" disabled>停止</button>
            <button onclick="resetList()">重置</button>
        </div>

        <div id="display" class="name-display">准备就绪</div>

        <div class="lists">
            <div class="name-list">
                <h3>剩余名单（<span id="remainingCount">0</span>）</h3>
                <div id="remainingList"></div>
            </div>
            <div class="name-list">
                <h3>已点名单（<span id="calledCount">0</span>）</h3>
                <div id="calledList"></div>
            </div>
        </div>
    </div>
    
    <!--音效模块-->
    <script src="audio.js"></script>
    <!--main-->
    <script src="main.js"></script>
</body>
</html>
